<template>
    <div>
      <div class="container">
          <el-form :model="formInline"  class="select-submit-form">
              <el-row type="flex">
                  <el-col :span="8">
                      <el-form-item label="服务设施编码">
                        <el-input v-model="formInline.serFacilCode"></el-input>
                      </el-form-item>
                  </el-col>
                <el-col :span="8">
                  <el-form-item label="服务设施名称">
                    <el-input v-model="formInline.serFacilName"></el-input>
                  </el-form-item>
                </el-col>
                <el-col :span="8">
                  <el-form-item label="拼音助记码">
                    <el-input v-model="formInline.pinyinCode"></el-input>
                  </el-form-item>
                </el-col>
              </el-row>
              <el-row type="flex">
                  <el-col :span="8">
                      <el-form-item label="有效标识">
                          <el-select  v-model="formInline.delFlag">
                            <el-option
                              v-for="item in ValidFlag"
                              :key="item.codeCode"
                              :label="item.codeCName"
                              :value="item.codeCode">
                            </el-option>
                          </el-select>
                      </el-form-item>
                  </el-col>
              </el-row>
              <el-row>
                <el-col :span="24">
                  <div class="select-btn-group">
                    <el-button type="primary" size="medium"  @click="onSubmitFwssmlgl">查询</el-button>
                    <el-button type="primary" size="medium" @click="handleReset">重置</el-button>
                    <el-button type="primary" size="medium" @click="save()" >增加</el-button>
                  </div>
                </el-col>
              </el-row>
          </el-form>
          <el-table
              :data="tableData"
              class="table"
              ref="multipleTable"
              header-cell-class-name="table-header"
              style="margin: 30px 0;border: 1px solid #d6d9d8;"
              v-loading="loading"
              element-loading-text="Loading....."
          >
              <el-table-column prop="" label="服务设施编码" align="center">
                <template slot-scope="scope">
                  <span style="margin-left: 10px">{{ scope.row.serFacilCode }}</span>
                </template>
              </el-table-column>
              <el-table-column prop="" label="服务设施名称" align="center">
                <template slot-scope="scope">
                  <span style="margin-left: 10px">{{ scope.row.serFacilName }}</span>
                </template>
              </el-table-column>
              <el-table-column prop="" label="拼音助记码" align="center">
                <template slot-scope="scope">
                  <span style="margin-left: 10px">{{ scope.row.pinyinCode }}</span>
                </template>
              </el-table-column>
            <el-table-column prop="" label="最高限价" align="center">
              <template slot-scope="scope">
                <span style="margin-left: 10px">{{ scope.row.maxPrice }}</span>
              </template>
            </el-table-column>

              <el-table-column prop="" label="开始日期" align="center">
                <template slot-scope="scope">
                  <span style="margin-left: 10px">{{ scope.row.startDate }}</span>
                </template>
              </el-table-column>
              <el-table-column prop="" label="终止日期" align="center">
                <template slot-scope="scope">
                  <span style="margin-left: 10px">{{ scope.row.endDate }}</span>
                </template>
              </el-table-column>
              <el-table-column prop="delFlag"  :formatter="delFlagFormat" label="有效标识" align="center">
              </el-table-column>
              <el-table-column label="操作" width="180" align="center">
                <template slot-scope="scope">
                  <el-button
                    size="mini"
                    type="text"
                    @click="handleLook(scope.$index, scope.row)">查看</el-button>
                  <el-button
                    size="mini"
                    type="text"
                    @click="handleEdit(scope.$index, scope.row)">修改</el-button>
                  <el-button
                    size="mini"
                    type="text"
                    @click="handleDelete(scope.$index, scope.row)">删除</el-button>
                </template>
              </el-table-column>
          </el-table>
          <div class="pagination" v-if="this.tableData.length!==0">
            <div class="index_page">
              <el-pagination :current-page="pagination.currentPage" :page-size="pagination.rowsNumber"
                              :page-sizes="[10, 20, 50, 100]"
                              :total="pagination.totalPage" background layout="prev, pager, next,sizes,total,jumper"
                              @size-change="handleSizeChange" @current-change="queryFun">
              </el-pagination>
            </div>
          </div>
      </div>
    </div>
</template>

<script>
  import * as api from '@/api/basicInformation'
  import * as api1 from '@/api/baseDate'
export default {
    name: 'baseform',
  inject:['reload'],
    data() {
        return {
          pagination: {
            currentPage: 1, // 当前页
            rowsNumber: 10, // 每页条数
            totalPage: 12 // 总条数
          },
          id:'',
          formInline:{
            comCode:'',
            methodSys:'',
            serFacilCode:'',
            serFacilName:'',
            pinyinCode:'',
            delFlag:'',
          },
          checkList: ['急诊'],
          props: { multiple: true },
          dialogFormVisible: false,
          dialogFormVisibleUpdate: false,
          tableData: [

          ],
          form: {},
          formUpdate:{
          },
          serveFacilityCatalogDemo:{},
          item:0,
          DoseType:[],
          ChargeCate:[],
          ChargeItemLevel:[],
          ValidFlag:[
            {
              codeCode:0,
              codeCName:'无效'
            },
            {
              codeCode:1,
              codeCName:'有效'
            },
          ],
        };
    },
  created() {
    this.ChargeCate1(),
    this.ChargeItemLevel1(),
    api.getQueryServiceFacilList({
      "head": {},
      "body": {
        "pageNum":this.pagination.currentPage,
        "pageSize":this.pagination.rowsNumber,
      }
    }).then(res => {
      console.log(res)
      this.tableData=res.data.list;
      this.pagination.totalPage=res.data.total;
    })
  },
  methods: {
    delFlagFormat(row, column) {
      let delFlag = row.delFlag
      if (delFlag === 0) {
        return '无效'
      } else if (delFlag === 1) {
        return '有效'
      }
    },
    handleSizeChange(pageSize){ // 改变当前页条数事件
      this.pagination.rowsNumber=pageSize
      this.onSubmitFwssmlgl();
      /* let pageIndex = this.pagination.currentPage;
       this.querySettleAuditTaskList(pageIndex,pageSize);*/
    },
    queryFun(pageNum){ // 改变当前页事件
      this.pagination.currentPage=pageNum
      this.onSubmitFwssmlgl();
      /* let rowsNumber = this.pagination.rowsNumber;
       this.querySettleAuditTaskList(pageNum,rowsNumber);*/
    },
    // 添加
    save(){
      this.$router.push({
        name: 'serveFacilityCatalogDemo',
        query: {
          serveFacilityCatalogDemo: JSON.stringify(this.serveFacilityCatalogDemo),
          item: JSON.stringify(0),
        }
      })
    },
      // 查询
    onSubmitFwssmlgl(){
      var data={
        "comCode":this.formInline.comCode,
        "methodSys":this.formInline.methodSys,
        "serFacilCode":this.formInline.serFacilCode,
        "serFacilName":this.formInline.serFacilName,
        "pinyinCode":this.formInline.pinyinCode,
        "delFlag":this.formInline.delFlag,
        "pageNum":this.pagination.currentPage,
        "pageSize":this.pagination.rowsNumber,
      }
      api.getQueryServiceFacil(data
      ).then(res => {
        this.tableData = res.data.list;
        this.pagination.totalPage=res.data.total;
        if(res.data.resultCode){
          if(res.data.resultCode !== '0000'){
            this.$message.error(res.data.resultMsg);
          }else{
            this.$message.success(res.data.resultMsg);
          }
        }else{

          this.pagination.totalPage = res.data.total;
        }
      })
    },
    // 查看
    handleLook(index,row){
      this.serveFacilityCatalogDemo=row,
        this.$router.push({
          name: 'serveFacilityCatalogDemo',
          query: {
            serveFacilityCatalogDemo: JSON.stringify(this.serveFacilityCatalogDemo),
            item: JSON.stringify(2),
          }
        })
    },
    // 修改
    handleEdit(index,rew){
      this.serveFacilityCatalogDemo=rew,
        this.$router.push({
          name: 'serveFacilityCatalogDemo',
          query: {
            serveFacilityCatalogDemo: JSON.stringify(this.serveFacilityCatalogDemo),
            item: JSON.stringify(1),
          }
        })
    },
    // 删除
    handleDelete(index,rew){
      var data={
        "id":rew.id,
      }
      api.getDeleteServiceFacil(data
      ).then(res => {
        if(res.data.resultCode){
          if(res.data.resultCode !== '0000'){
            this.$message.error(res.data.resultMsg);
          }else{
            this.$message.success(res.data.resultMsg);
          }
        }
        this.reload();
      })
    },
    // 收费类别
    ChargeCate1(){
      var data={
        "codeType": "ChargeCate"
      }
      api1.MedType(data
      ).then(res => {
        // debugger
        this.ChargeCate=res.data
      })
    },
    // 收费项目等级
    ChargeItemLevel1(){
      var data={
        "codeType": "ChargeItemLevel"
      }
      api1.MedType(data
      ).then(res => {
        // debugger
        this.ChargeItemLevel=res.data
      })
    },
        onSubmit() {
            this.$message.success('提交成功！');
        },
        // 分页导航
        handlePageChange(val) {
            this.$set(this.query, 'pageIndex', val);
            this.getData();
        },
    }
};
</script>